<template>
    <div>
        <modal :show.sync="show" id="issues-modal">
            <template slot="header"></template>
            <template slot="body">
                <div>
                    <div class="form-group">
                        <label for="">类型</label>
                        <select class="form-control" v-model="issue.type">
                            <option v-for="tag in $store.state.issuesType" :value="tag">{{tag}}</option>
                        </select>
                    </div>
                    <div class="form-group">
                        <label for="">问题分类
                            <i v-tooltip.top="`Get Issue Tip`" class="fif fif-tip text-info" style="cursor: pointer;" @click="getIssueTip"></i>
                        </label>
                        <menu-select :init="show" v-model="issue.type_code"></menu-select>
                    </div>
                    <div class="form-group">
                        <label for="">标题 <i class="text-danger">*</i></label>
                        <input v-model="issue.summary" type="text" class="form-control" placeholder="标题"></div>
                    <div class="form-group">
                        <label for="">内容 <i class="text-danger">*</i></label>
                        <textarea rows="10" v-model="issue.message" class="form-control"></textarea>
                    </div>
                    <div class="form-group">
                        <label for="">相关信息</label>
                        <textarea rows="4" :value="issueRelatedMessage.plain" class="form-control" disabled></textarea>
                    </div>
                </div>
            </template>
            <template slot="footer">
                <button type="button" class="btn btn-default waves-effect" @click="$emit('update:show', false)">Close</button>
                <button type="button" class="btn btn-danger waves-effect waves-light" @click="addIssue">Submit</button>
            </template>
        </modal>
    </div>
</template>

<script>
    import Modal from '@/components/widgets/Modal'
    import ShowSync from '@/mixins/ShowSync'
    import MenuSelect from '@/components/widgets/MenuSelect'
    import Config from '@/config'
    import {addModel, searchModel} from '@/api/model'
    import {getIssues} from '@/api/auth'
    import swal from 'sweetalert'

    export default {
        name: "CreateIssue",
        components: {Modal, MenuSelect},
        mixins: [ShowSync],
        created() {
            this.groups = Config.GROUPS
        },
        props: {
            issueRelatedMessage: {
                type: Object,
                default: () => {}
            }
        },
        data() {
            return {
                issue: {
                    type: 'Dup. Order',
                    summary: '',
                    message: '',
                    type_code: '',
                    related_chat_id: '',
                    related_message_id: '',
                },
            }
        },
        methods: {
            addIssue() {
                let currentGroup = null
                this.groups.forEach(item => {
                    if (this.$store.state.groups.indexOf(item.value) !== -1) {
                        currentGroup = item.value
                    }
                })

                if (!currentGroup) {
                    return $.toast({
                        heading: 'Wrong',
                        text: '你没有权限操作',
                        position: 'top-right',
                        loaderBg: '#ff6849',
                        icon: 'error'
                    });
                }

                if (this.issue.related_chat &&　this.issue.summary.trim() && this.issue.message.trim()) {

                    this.issue.current_group = currentGroup

                    this.issue.current_user = this.$store.state.user

                    addModel('issues', this.issue).then(res => {
                        swal("success", "", "success")
                        this.$emit('update:show', false)
                        if (String(this.currentChat.label).indexOf(this.issue.type) === -1) {
                            this.setLabel(this.currentChat, this.issue.type)
                        }
                        this.$store.dispatch("setIssueNum")
                    })
                } else {
                    $.toast({
                        heading: '请填写完整',
                        text: '',
                        position: 'top-right',
                        loaderBg: '#ff6849',
                        icon: 'error',
                    });
                }
            },
            getIssueTip() {
                if (!this.issue.type_code.trim().length) {
                    return $.toast({
                        heading: 'Wrong',
                        text: '输入CASE CODE',
                        position: 'top-right',
                        loaderBg: '#ff6849',
                        icon: 'error'
                    });
                }

                searchModel('IssueReccomendation', {
                    page: 1,
                    search_keys: {
                        type_code: this.issue.type_code
                    }
                }, null).then(res => {
                    if (res.data.list.length) {
                        swal('', res.data.list[0].recommendation, 'info')
                    } else {
                        $.toast({
                            heading: 'Wrong',
                            text: '没有匹配的CASE',
                            position: 'top-right',
                            loaderBg: '#ff6849',
                            icon: 'error'
                        });
                    }
                })
            },
        },
        watch: {
            issueRelatedMessage() {
                this.related_chat_id = this.issueRelatedMessage.chat_id;
                this.related_message_id = this.issueRelatedMessage.msg_id;
            }
        }
    }
</script>

<style scoped>

</style>